import Vue from "vue";
import Vuex, { mapActions, mapGetters, mapMutations, mapState } from 'vuex';
import axios from 'axios'


Vue.use(Vuex)
const state = {
    isFirst:true,
    isLoading:false,
    isError:'',
    cards:[],
}
const mutations = {
    REQ_BOFORE(state){
        state.isFirst = false,
        state.isLoading = true
    },
    REQ_SUCCESS(state){
        state.isLoading = false
    },
    REQ_CARDS(state,newcards){
        state.cards = newcards
    },
    REQ_ERROR(state,msg){
        state.isLoading = false,
        state.isError = msg

    }


}
const actions = {
    // 通过获取keyword去发送请求
    async getCards({commit},keyword){
        // 在发送请求前发送给mutations去修改isFirst和isLoading数据
        commit('REQ_BOFORE')

        // console.log(keyword);
        
        try{
            const res = await axios({
                url:'https://api.github.com/search/users?',
                params:{
                    q:keyword,
                },
                method:'get',
            })
            // 发送请求成功
            // 发送mutations去修改isLoading
            commit('REQ_SUCCESS')
            // 处理得到想要的数据
            const newcards = res.data.items.map(item=>{
                return {
                    id:item.id,
                    login:item.login,
                    url:item.url,
                    avatar_url:item.avatar_url
                }
            })
            // 发送给mutations去修改cards数据
            commit('REQ_CARDS',newcards)

        }catch(err){
            // 发送请求失败
            // 发送给mutations去修改isLoading和isError
            commit('REQ_ERROR',err.message)
        }

        

        // .then((res)=>{
        //     // 发送请求成功
        //     // 发送mutations去修改isLoading
        //     commit('REQ_SUCCESS')
        //     // 处理得到想要的数据
        //     const newcards = res.data.items.map(item=>{
        //         return {
        //             id:item.id,
        //             login:item.login,
        //             url:item.url,
        //             avatar_url:item.avatar_url
        //         }
        //     })
        //     // 发送给mutations去修改cards数据
        //     commit('REQ_CARDS',newcards)
        // },(err)=>{
        //     // 发送请求失败
        //     // 发送给mutations去修改isLoading和isError
        //     commit('REQ_ERROR',err.message)
        // })

    }
}
const getters = {

}
export default new Vuex.Store({
    state,
    mutations,
    actions,
    getters,
})